<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
    <meta content=always name=referrer>
    <link rel="stylesheet" type="text/css" href="__STATIC__/css/base_user.css">
    <script src="__STATIC__/js/jquery-1.8.2.js"></script>
    <title>管理收货地址</title>
    <style>
        input{
            -webkit-appearance:none;
        }
    </style>
</head>
{include file="public/href" /}
<body>
<form action="{:url('mobile/user_info/create_address')}" method="post"  id="form">
<div class="wrap-man">
    <div class="header">
        <p>添加新地址</p>
        <img src="__STATIC__/img_user/back.png" class="back" onclick="back_url()">
        <span><a id="save">保存</a></span>
    </div>
    <ul class="info">
        <li><span>收货人:</span><input type="text" name="name" datatype="xing_ming" placeholder="请输入收货人名称" datatype="s2-4" nullmsg="姓名不能为空" errormsg="请填写正确格式的姓名"></li>
        <li><span>联系电话:</span><input type="number" oninput="if(value.length>11)value=value.slice(0,11)" min="1" name="phone" placeholder="请输入收货人电话" nullmsg="电话不能为空" datatype="m" errormsg="电话格式不正确" ></li>
        <li><span>所在地区:</span><br/>

            <select id="one_area" name="province_id" onchange="change_area()" style="font-size: 8px;width: 30%;">
                {volist name='area' id='item'}
                <option value="{$item.area_id}" >{$item.area_name}</option>
                {/volist}
            </select>
            <font id="two_level"></font>
            <font id="three_level"></font>

        </li>
        <!--<input type="hidden" id="selected" name="area_info" />-->
        <input type="hidden" id="act" value="{:input('act','')}" />
        <li class="last"><textarea placeholder="详细地址:" datatype="*1-100" nullmsg="请输入详细收货地址" errormsg="请输入100任意字符以内" name="address"></textarea></li>
    </ul>
    <div class="primary">
        <label for="radio-1-1"><span> 设为默认地址</span></label>  <input type="checkbox" id="radio-1-1" name="status" class="radio" checked />
    </div>
</div>
</form>
{include file="public/src" /}
<script>
    //验证表单元素
    $(function () {
        $.Tipmsg.r = null;
        $.Tipmsg.p = null;
        $.Datatype.xing_ming = /^[\u4E00-\u9FA5\uf900-\ufa2d]{2,4}$/;
        var demo = $("#form").Validform({
            btnSubmit:'#save',
            tiptype: function (msg) {
                layer.open({content: msg, skin: 'msg', time:2});
            },
            tipSweep: true,
            ajaxPost:true,
            callback:function(t){
                if (t.code == 200){
                    var url = '';
                    if ($('#act').val() == 'order'){
                        url = 'act=order'
                    }
                    layer.open({content:t.message,skin:'msg',time:2});
                    window.location.href = "address_manage?"+url;
                }else{
                    layer.open({content:t.message,skin:'msg',time:2});
                }
            }
        });
        demo.config({
            ajaxpost:{
                error: function () {
                    layer.open({content:'您的手机网络信号不好',skin:'msg',time:2});
                }
            }
        });
        change_area();
    });
    function back_url(){
        if ($('#act').val() == 'order'){
            window.location.href = "address_manage?act=order";
        }else{
            window.location.href = "address_manage";
        }
    }
    //城市三级联动
    function change_area(){
        var one = $('#one_area').val();
        $.post("lianDong",{'id':one},function (t) {
            var html = '<select id="two_area" name="city_id" onchange="change_there_area()" style="font-size: 8px;width: 30%;">';
            for (var i=0;i<t.length;i++){
                html += '<option value="'+t[i].area_id+'">'+t[i].area_name+'</option>';
            }
            $('#two_level').html(html+'</select>');
            change_there_area();
        })
    }
    function change_there_area(){
        var two = $('#two_area').val();
        $.post("lianDong",{'id':two},function (t) {
            var html = '<select name="area_id" style="font-size: 8px;width: 30%;" >';
//            onchange="set_zhi(this.options[this.selectedIndex].text)"
            for (var i=0;i<t.length;i++){
//                if (i==0){set_zhi(t[i].area_name)};
                html += '<option value="'+t[i].area_id+'">'+t[i].area_name+'</option>';
            }
            $('#three_level').html(html+'</select>');
        })
    }
//    function set_zhi(zhi){
//        $('#selected').val(zhi);
//    }
</script>
</body>
</html>